<template>
  <view>
    <scroll-view
        :enableBackToTop="true"
        :enableFlex="true"
        :refresherEnabled="true"
        :refresherTriggered="triggered"
        :scrollTop="scrolltop"
        :scrollWithAnimation="true"
        :scrollY="true"
        class="msg"
        lowerThreshold="300"
        @refresherrefresh="moreFn"
    >
      <block v-if="INIT.total == 0">
        <view class="dl">
          <view class="dt">
            <navigator :url="'/pagesA/u/u?uid=' + uid">
              <image :src="U.photo_s_url" mode="aspectFill"></image>
            </navigator>
          </view>
          <view class="dd">{{ LIST[0][0].c }}</view>
        </view>
        <view :style="'color:' + color + ';'" class="firsttips">
          <view class="i ico"></view>
          <view>聊天涉及钱财和个人隐私问题</view>
          <view>请保持警惕，避免上当受骗</view>
          <view>切勿随意泄漏个人联系方式</view>
          <view>若发现可疑行为，请及时举报</view>
        </view>
      </block>
      <block v-else>
        <block v-for="(dl, index) in LIST" :key="index">
          <block v-for="(item, item_index) in dl" :key="item_index">
            <view v-if="!globalUtils.empty(item.addtime)" class="span">{{ item.addtime }}</view>
            <view :class="'dl ' + item.class" :style="'--color:' + color + ';--rgbcolor:' + rgbcolor">
              <view class="dt">
                <navigator v-if="item.class != 'my'" :url="'/pagesA/u/u?uid=' + uid">
                  <image :src="U.photo_s_url" mode="aspectFill"></image>
                </navigator>
                <image v-else :src="MY.photo_s_url" mode="aspectFill"></image>
              </view>
              <view class="dd">
                <view v-if="item.class != 'my' && INIT.iflocked != 1" class="lock" @tap="look_lockopenFn">
                  <view>此条信息已隐藏</view>
                  <view>您与TA的聊天通道还没打开</view>
                  <view class="a">
                    <view class="i ico"></view>
                    点击解锁
                  </view>
                </view>
                <rich-text v-else :nodes="item.c"></rich-text>
              </view>
            </view>
          </block>
        </block>
      </block>
    </scroll-view>
    <view v-if="ext_show" :class="'mask1 ' + ext_class" @tap="ext_closeFn">
      <view :style="'--color:' + color + ';--rgbcolor:' + rgbcolor" class="ext">
        <view class="text_reset" @tap.stop.prevent="text_resetFn">
          换一组
          <text class="ico"></text>
        </view>
        <view v-for="(item, item_index) in ext_text" :key="item_index" :data-v="item" class="li"
              @tap.stop.prevent="text_okFn">
          <text class="ico"></text>
          {{ item }}
        </view>
      </view>
    </view>


    <form class="formData" @submit="sendFn">
      <view
          :style="'--color:' + color + ';--rgbcolor:' + rgbcolor + '; transform: translate(0,' + keyboardHeight + 'px)' "
          class="writebox">
        <view class="formData">
          <view class="li text ico" @tap="extFn"></view>
          <textarea
              v-model="inputvalue"
              :adjust-position="false"
              :focus="inputfocus"
              auto-height="true"
              class="li input"
              confirmHold="ture"
              confirmType="send"
              cursor-spacing="10"
              maxlength="500"
              name="content"
              type="text"
              @confirm="bindconfirmFn"
          />
          <button class="btn3" formType="submit">发送</button>
        </view>
      </view>

    </form>
    <view class="blank"></view>

    <view v-if="div_vip" :class="'mask3 ' + mask_class" data-maskid="div_vip" @tap="mask_closeFn">
      <view class="div_box div_vip" style="--div_box_width: 600rpx; --div_box_height: 650rpx"
            @tap.stop.prevent="emptyFn">
        <view class="closebtm ico" data-maskid="div_vip" @tap.stop.prevent="mask_closeFn"></view>
        <view class="h1">{{ div_vip_title }}</view>
        <rich-text :nodes="div_vip_c" class="C S15"
                   style="display: block; height: 300rpx; overflow: hidden; overflow-y: auto"></rich-text>
        <view class="ico picico"></view>
        <navigator class="btn_btm btn44 ico" url="/pagesA/my_vip/my_vip"> 立即升级</navigator>
      </view>
    </view>
    <view v-if="div_cert" :class="'mask3 ' + mask_class" data-closekind="back" data-maskid="div_cert"
          @tap="mask_closeFn">
      <view class="div_box div_cert" style="--div_box_width: 600rpx; --div_box_height: 480rpx"
            @tap.stop.prevent="emptyFn">
        <view class="closebtm ico" data-closekind="back" data-maskid="div_cert" @tap.stop.prevent="mask_closeFn">
        </view>
        <view class="h1">{{ div_cert_title }}</view>
        <view class="C S15">成为认证用户，即享沟通特权</view>
        <view class="C S15">提高诚信值，杜绝虚假</view>
        <view class="ico picico"></view>
        <navigator class="btn_btm btn44 ico" url="/myPages/cert/cert">立即认证</navigator>
      </view>
    </view>
    <view v-if="div_data" :class="'mask3 ' + mask_class" data-closekind="back" data-maskid="div_data"
          @tap="mask_closeFn">
      <view
          :style="'--div_box_width:600rpx;--div_box_height:480rpx;--color:' + color + ';--rgbcolor:' + rgbcolor"
          class="div_box div_data"
          @tap.stop.prevent="emptyFn"
      >
        <view class="closebtm ico" data-closekind="back" data-maskid="div_data" @tap.stop.prevent="mask_closeFn">
        </view>
        <view class="h1">{{ div_data_title }}</view>
        <view class="C S15">赶快去完善，解锁更多功能</view>
        <view class="C S15">完成资料，上传头像，受关注度暴增</view>
        <view class="ico picico"></view>
        <navigator class="btn_btm btn44 ico" url="/pagesA/reg/reg">立即完善</navigator>
      </view>
    </view>
    <view v-if="div_clickloveb_confirm" :class="'mask3 ' + mask_class" data-closekind="back"
          data-maskid="div_clickloveb_confirm"
          @tap="mask_closeFn">
      <view
          :style="'--div_box_width:600rpx;--div_box_height:666rpx;--color:' + color + ';--rgbcolor:' + rgbcolor"
          class="div_box div_data"
          @tap.stop.prevent="emptyFn"
      >
        <view class="closebtm ico" data-closekind="back" data-maskid="div_clickloveb_confirm"
              @tap.stop.prevent="mask_closeFn">
        </view>
        <view class="h1">聊天解锁</view>
        <view class="C S12">{{ INIT.myloveb }}</view>
        <view class="helpDiv">
          <view class="ul">
            <view v-for="(item, index) in INIT.clickloveb_confirm" :key="index" class="li">
              <image :src="item.grade_ico" class="ugrade1" mode="aspectFit"></image>

              {{ item.title }}

              <text class="i ico"></text>

              <rich-text :nodes="item.numlovebstr" class="numlovebstr"></rich-text>
            </view>
          </view>
        </view>
        <view class="ico picico"></view>
        <view class="btn_btm cols2">
          <view class="btn4 ico" @tap="clicklovebFn"> 单次解锁</view>
          <navigator class="btn4 ico VIP" style="background: #c3994c; box-shadow: 0 6rpx 16rpx rgba(195, 153, 76, 0.4)"
                     url="/pagesA/my_vip/my_vip"> 会员升级
          </navigator>
        </view>
      </view>
    </view>
    <view v-if="div_noucount" :class="'mask3 ' + mask_class" data-closekind="back" data-maskid="div_noucount"
          @tap="mask_closeFn">
      <view
          :style="'--div_box_width:600rpx;--div_box_height:666rpx;--color:' + color + ';--rgbcolor:' + rgbcolor"
          class="div_box div_data"
          @tap.stop.prevent="emptyFn"
      >
        <view class="closebtm ico" data-closekind="back" data-maskid="div_noucount" @tap.stop.prevent="mask_closeFn">
        </view>
        <view class="h1">{{ div_data_title }}</view>
        <view class="helpDiv">
          <view class="ul">
            <view v-for="(item, index) in INIT.noucount" :key="index" class="li">
              <image :src="item.grade_ico" class="ugrade1" mode="aspectFit"></image>

              {{ item.title }}

              <text class="i ico"></text>

              <rich-text :nodes="item.numrstr" class="numlovebstr"></rich-text>
            </view>
          </view>
        </view>
        <view class="ico picico"></view>
        <navigator class="btn_btm btn44 ico"
                   style="width: 86%; left: 7%; background: #c3994c; box-shadow: 0 6rpx 16rpx rgba(195, 153, 76, 0.4)"
                   url="/pagesA/my_vip/my_vip">
           会员升级
        </navigator>
      </view>
    </view>
    <view v-if="div_noloveb" :class="'mask3 ' + mask_class" data-maskid="div_noloveb" @tap="mask_closeFn">
      <view
          :style="'--div_box_width:600rpx;--div_box_height:500rpx;--color:' + color + ';--rgbcolor:' + rgbcolor"
          class="div_box div_data "
          @tap.stop.prevent="emptyFn"
      >
        <view class="closebtm ico" data-maskid="div_noloveb" @tap.stop.prevent="mask_closeFn"></view>
        <view class="h1">{{ div_data_title }}</view>
        <view class="C S15" style="margin-top: 40rpx">{{ div_data_c }}</view>
        <view class="C S15" style="margin-top: 40rpx">请点击下方按钮购买</view>
        <view class="C S15">购买后请重新发起聊天请求</view>
        <view class="ico picico"></view>
        <view class="btn_btm cols2">
          <navigator class="btn4 ico" url="/myPages/loveb/loveb?currentTab=2">在线支付</navigator>
          <navigator class="btn4 ico" url="/myPages/hongniang/hongniang">找经纪人购买</navigator>
        </view>
      </view>
    </view>
  </view>
</template>
<script>
import globalUtils from "../../res/www.a9a.cn";

var t = require('../../@babel/runtime/helpers/defineProperty');
var a = require('../../res/www.a9a.cn.js');
var app = getApp();
var i = uni.getStorageSync('COOK_U');
var s = 1;
var n = true;
export default {
  computed: {
    globalUtils() {
      return globalUtils
    }
  },
  data() {
    return {
      triggered: true,
      mask_class: 'alpha0_100',
      scrolltop: 99999,
      uid: '',
      color: '',
      rgbcolor: '',
      loveb_str: '',

      U: {
        photo_s_url: ''
      },

      MY: {
        photo_s_url: ''
      },

      INIT: {
        total: 1,
        iflocked: 0,
        myloveb: '',
        clickloveb_confirm: [],
        noucount: []
      },

      LIST: '',
      inputfocus: false,
      inputvalue: '',
      div_vip_c: '',
      div_data_c: '',
      div_clickloveb_confirm: false,
      ext_text: '',
      ext_show: false,
      ext_class: '',
      c: '',
      dl: [],
      div_vip: '',
      div_vip_title: '',
      div_cert: '',
      div_cert_title: '',
      div_data: false,
      div_data_title: '',
      div_noucount: '',
      div_noloveb: '',
      keyboardHeight: 0,
    };
  },
  onLoad: function (t) {
    var that = this;
    s = 1;
    app.globalData.get_openid().then(function (s) {
      that.setData({
        uid: t.uid,
        color: app.globalData._ZEAI.color,
        rgbcolor: a.c16_rgb(app.globalData._ZEAI.color),
        loveb_str: app.globalData._ZEAI.loveb
      });
      app.globalData.chklogin().then(function (t) {
        if (t) {
          i = uni.getStorageSync('COOK_U');
          app.globalData.ajax({
            url: 'chat.php',
            data: {
              submitok: 'chat',
              uid: that.uid,
              openid: i.openid
            },
            success: function (t) {
              console.log('获取到的数据', t);
              if (1 == t.flag) {
                that.setData({
                  U: t.U,
                  MY: t.MY
                });
                uni.setNavigationBarTitle({
                  title: t.U.nickname
                });
                that.init_list();
              } else {
                if ('nosign' == t.flag) {
                  uni.showModal({
                    title: t.title,
                    content: t.msg,
                    confirmColor: that.color,
                    cancelText: '取消',
                    confirmText: '立即签署',
                    success: function (t) {
                      if (t.confirm) {
                        uni.redirectTo({
                          url: '/myPages/sign/sign'
                        });
                      } else {
                        uni.navigateBack();
                      }
                    }
                  });
                } else {
                  (t.this = that), a.sorry(t);
                }
              }
            }
          });
          that.time = setInterval(function () {
            that.chk_flag();
          }, 5000);
        } else {
          uni.reLaunch({
            url: '../index/index'
          });
        }
      });
    });
  },
  onUnload: function () {
    clearInterval(this.time);
  },
  onReady() {
    // 监听键盘高度变化
    uni.onKeyboardHeightChange(res => {
      const keyHeight = res.height
      if (keyHeight === 0) {
        this.keyboardHeight = 0
      } else {
        this.keyboardHeight = -keyHeight
      }
      console.log('上移高度', keyHeight)
    })
  },
  methods: {
    init_list: function () {
      var that = this;
      uni.showLoading({
        title: '玩命加载中',
        mask: true
      });
      n = false;
      i = uni.getStorageSync('COOK_U');
      app.globalData.ajax({
        url: 'chat.php',
        data: {
          submitok: 'init_list',
          uid: that.uid,
          openid: i.openid
        },
        success: function (e) {
          1 == e.flag
              ? (that.setData(
                  t(
                      {
                        INIT: e.INIT
                      },
                      'LIST[0]',
                      e.LIST
                  )
              ),
                  that.scrolltopFun())
              : uni.showToast({
                title: e.msg,
                icon: 'none',
                mask: true
              });
          uni.hideLoading();
          n = true;
        }
      });
    },

    chk_flag: function () {
      var that = this;
      app.globalData.ajax({
        url: 'chat.php',
        data: {
          submitok: 'chk_flag',
          uid: that.uid,
          openid: i.openid
        },
        success: function (a) {
          if (1 == a.flag) {
            that.getmess_one();
          }
        }
      });
    },

    getmess_one: function () {
      var that = this;
      app.globalData.ajax({
        url: 'chat.php',
        data: {
          submitok: 'getmess_one',
          uid: that.uid,
          openid: i.openid
        },
        success: function (e) {
          if (1 == e.flag) {
            var i = that.LIST;
            var s = i.length - 1;
            var n = i[s];
            n = n.concat(e.LIST);
            that.setData(t({}, 'LIST[' + s + ']', n));
            that.scrolltopFun();
          } else {
            uni.showToast({
              title: e.msg,
              icon: 'none',
              mask: true
            });
          }
        }
      });
    },

    moreFn: function () {
      var that = this;
      var a = this;
      0 != this.INIT.ifmore
          ? (uni.vibrateShort({
            type: 'heavy'
          }),
              setTimeout(function () {
                var o = that.LIST;
                n
                    ? ((n = false),
                        app.globalData.ajax({
                          url: 'chat.php',
                          data: {
                            submitok: 'more',
                            p: s,
                            uid: a.uid,
                            openid: i.openid
                          },
                          success: function (t) {
                            if (1 == t.flag) {
                              o.length;
                              if (t.LIST.length < 1) {
                                n = false;
                                return void a.setData({
                                  triggered: false
                                });
                              }
                              var e = [];
                              e.push(t.LIST);
                              e = e.concat(o);
                              a.setData({
                                triggered: false,
                                INIT: t.INIT,
                                LIST: e
                              });
                              s += 1;
                              n = true;
                            } else {
                              uni.showToast({
                                title: t.msg,
                                icon: 'none',
                                mask: true
                              });
                            }
                          }
                        }))
                    : a.setData({
                      triggered: false
                    });
              }, 500))
          : a.setData({
            triggered: false
          });
    },

    sendFn: function (t) {
      var e = t.detail.value.content;
      a.empty(e)
          ? this.setData({
            inputfocus: true
          })
          : (this.setData({
            inputvalue: e
          }),
              this.sendmsg(e));
    },

    sendmsg: function (s) {
      var that = this;
      app.globalData.ajax({
        url: 'chat.php',
        data: {
          submitok: 'add',
          uid: that.uid,
          openid: i.openid,
          content: s
        },
        success: function (e) {
          if (1 == e.flag) {
            var i;
            var o = that.LIST;
            var c = o.length - 1;
            var u = o[c];
            u.push({
              class: 'my',
              c: s
            });
            that.setData((t((i = {}), 'INIT.total', that.INIT.total + 1), t(i, 'LIST[' + c + ']', u), t(i, 'inputvalue', ''), i));
            that.scrolltopFun();
            that.inputvalue = ''
            console.log('我发送了消息')
          } else {
            e.this = that;
            a.sorry(e);
            that.setData({
              div_vip_c: e.msg
            });
          }
        }
      });
    },

    clicklovebFn: function () {
      var that = this;
      app.globalData.ajax({
        url: 'chat.php',
        data: {
          submitok: 'clickloveb',
          uid: that.uid,
          openid: i.openid
        },
        success: function (e) {
          1 == e.flag
              ? (that.setData(
                  t(
                      {
                        div_clickloveb_confirm: false
                      },
                      'INIT.iflocked',
                      1
                  )
              ),
              a.empty(that.inputvalue) || that.sendmsg(that.inputvalue))
              : ((e.this = that),
                  a.sorry(e),
                  that.setData({
                    div_data_c: e.msg
                  }),
              'noloveb' == e.flag &&
              that.setData({
                div_clickloveb_confirm: false
              }));
        }
      });
    },

    look_lockopenFn: function () {
      var that = this;
      app.globalData.ajax({
        url: 'chat.php',
        data: {
          submitok: 'look_lockopen',
          uid: that.uid,
          openid: i.openid
        },
        success: function (e) {
          1 == e.flag
              ? that.setData(t({}, 'INIT.iflocked', 1))
              : ((e.this = that),
                  a.sorry(e),
                  that.setData({
                    div_data_c: e.msg
                  }),
              'noloveb' == e.flag &&
              that.setData({
                div_clickloveb_confirm: false
              }));
        }
      });
    },

    bindconfirmFn: function (t) {
      var e = t.detail.value;
      a.empty(e) || this.sendmsg(e);
    },

    scrolltopFun: function () {
      var that = this;
      setTimeout(function () {
        that.setData({
          scrolltop: 99999
        });
      }, 100);
    },

    mask_closeFn: function (a) {
      var that = this;
      var i = a.currentTarget.dataset.maskid;
      if ('back' == a.currentTarget.dataset.closekind) {
        this.setData(t({}, i, false));
        uni.navigateBack();
      }
      this.setData({
        mask_class: 'alpha100_0'
      });
      setTimeout(function () {
        that.setData(t({}, i, false));
      }, 400);
    },

    extFn: function () {
      var that = this;
      app.globalData.ajax({
        url: 'chat.php',
        data: {
          submitok: 'ext_text',
          uid: this.uid,
          openid: i.openid
        },
        success: function (a) {
          1 == a.flag
              ? that.setData({
                ext_text: a.ext_text,
                ext_show: true,
                ext_class: 'alpha0_100'
              })
              : uni.showToast({
                title: a.msg,
                icon: 'none',
                mask: true
              });
        }
      });
    },

    text_resetFn: function () {
      var that = this;
      app.globalData.ajax({
        url: 'chat.php',
        data: {
          submitok: 'ext_text',
          uid: this.uid,
          openid: i.openid
        },
        success: function (a) {
          1 == a.flag
              ? that.setData({
                ext_text: a.ext_text
              })
              : uni.showToast({
                title: a.msg,
                icon: 'none',
                mask: true
              });
        }
      });
    },

    text_okFn: function (t) {
      var a = t.currentTarget.dataset.v;
      this.ext_closeFn();
      this.setData({
        inputvalue: a
      });
    },

    ext_closeFn: function () {
      var that = this;
      this.setData({
        ext_class: 'alpha100_0'
      });
      setTimeout(function () {
        that.setData({
          ext_show: false
        });
      }, 500);
    },

    emptyFn: function () {
    }
  }
};
</script>
<style>
@import 'chat.css';
</style>
